var	ele = document.getElementById('foo');

/**
 * 间隔执行器，对动画进行60fps的执行
 * @param  {[type]} ) {	return      window.requestAnimationFrame || window.webkitRequestAnimationFrame ||				  window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||				  function (callback) {				  	window.setTimeout(callback, 1000 / 60);				 }})( [description]
 * @return {[type]}   [兼容的requestAnimationFrame]
 */
window.requestAnimationFrame = (function() {
	return  window.requestAnimationFrame || window.webkitRequestAnimationFrame ||
    window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||
   function (callback) {
  	 window.setTimeout(callback, 1000 / 60);
  }
})();


window.cancelAnimationFrame = (function () {
	return window.cancelAnimationFrame || window.mozCancelAnimationFrame || window.clearTimeout
})();


var	maxLen = 100;
var len = 0;
var  animateId;


ele.onclick = function() {
	if (animateId) {
		animateId = window.cancelAnimationFrame(animateId);;
	} else {
		animate(render);
	}
}

/**
 * DOM渲染函数
 */
function  render() {
	ele.style.transform = 'translateX('+ len +'%)';
}

/**
 * 动画执行器
 */
function  animate () {
	if (len >= maxLen) {
		len  = 0;
	} else {
		len += 0.3;
	}
	render();
	animateId = window.requestAnimationFrame(animate, ele);
}

